import React from 'react'

export default function AddUserDrawer() {
  return (
    <Drawer
        title="Drawer with extra actions"
        placement={placement}
        width={500}
        onClose={onClose}
        open={open}
        extra={
          <Space>
            <Button onClick={onClose}>Cancel</Button>
            <Button type="primary" onClick={onClose}>
              OK
            </Button>
          </Space>
        }
      >
        <Form {...layout} name="nest-messages" onFinish={onFinish} validateMessages={validateMessages}>
          <Form.Item
            name={['user', 'username']}
            label="用户名"
            rules={[
              {
                required: true,
              },
            ]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="密码"
            name={['user', 'password']}
            rules={[
              {
                required: true,
                message: '请输入你的密码',
              },
            ]}
          >
            <Input.Password />
          </Form.Item>
          <Form.Item
            name={['user', 'email']}
            label="邮箱"
          >
            <Input />
          </Form.Item>
          <Form.Item
            name={['user', 'mobile']}
            label="手机"
          >
            <Input />
          </Form.Item>
          <Form.Item
            label="角色"
            name={['user', 'roleId']}
            rules={[
              {
                required: true,
              },
            ]}
          >
            <Select>
              {
                roletData.map(item => {
                  return <Select.Option key={item.roleId} value={item.roleId}>{item.roleName}</Select.Option>
                })
              }

            </Select>
          </Form.Item>
          <Form.Item label="部门" name={['user', 'deptId']}>
            <TreeSelect
              treeData={deptData}
            />
          </Form.Item>
          <Form.Item label="状态" name={['user', 'status']}
            rules={[
              {
                required: true,
              },
            ]}
          >
            <Radio.Group onChange={onChange} value={value}>
              <Radio value={"0"}>锁定</Radio>
              <Radio value={"1"}>有效</Radio>
            </Radio.Group>
          </Form.Item>
          <Form.Item label="性别" name={['user', 'ssex']}
            rules={[
              {
                required: true,
              },
            ]}
          >
            <Radio.Group onChange={onChange} value={value}>
              <Radio value={"0"}>男</Radio>
              <Radio value={"1"}>女</Radio>
              <Radio value={"2"}>保密</Radio>
            </Radio.Group>
          </Form.Item>
          <Form.Item
            wrapperCol={{
              ...layout.wrapperCol,
              offset: 8,
            }}
          >
            <Space>
              <Button onClick={onClose}>取消</Button>
              <Button type="primary" htmlType="submit">
                提交
              </Button>
            </Space>

          </Form.Item>
        </Form>
      </Drawer>
  )
}
